<template>
	<view class="page">
		<view class="user">
			<view class="userinfo" v-if="loginShow">
				<!-- <view class="pic">
					名
				</view> -->
				<view style=" display: inline-block;margin: 30px auto;">
					<u-upload
						:fileList="IDcardFile1"
						@afterRead="IDcardFileRead"
						@delete="deleteIDcardFile"
						name="1"
						multiple
						:maxCount="1"
						>
						<view class="pic">
							名
						</view>
					</u-upload>
				</view>
				
				<view class="name">用戶名稱</view>
				<view class="signature">
					这个人很懒，没有留下个人签名
				</view>
				<view class="fansList">
					<view class="fansList-li">
						<span>0</span>
						<p>粉絲</p>
					</view>
					<view class="fansList-li">
						<span>0</span>
						<p>關注</p>
					</view>
					<!-- <view class="fansList-li">
						<span>0</span>
						<p>評分</p>
					</view> -->
				</view>
			</view>
			<view v-else>
				<button class="login_btn"  @click="openUrl('/pages/login/login')">手機號快捷登入/注册</button>
			</view>
		
			<u-cell-group style="margin: 20px;" class="group">
				<u-cell icon="grid-fill" title="實名認證" @click="openUrl('/pages/user/cert')"></u-cell>
				<!-- <u-cell icon="edit-pen-fill" title="個人資訊" @click="openUrl('/pages/user/my')"></u-cell> -->
				<u-cell icon="grid-fill" title="我的活動" @click="openUrl('/pages/user/myActive')"></u-cell>
				<!-- <u-cell icon="integral-fill" title="個人資訊認證稽核" @click="openUrl('/pages/user/myPass')"></u-cell> -->
				<u-cell icon="server-fill" title="聯系客服" @click="noOpen"></u-cell>
				<u-cell icon="grid-fill" title="常見問題" @click="noOpen"></u-cell>
				<u-cell icon="setting-fill" title="登出" @click="loginShow=false"></u-cell>
			</u-cell-group>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loginShow:true,
				IDcardFile:[]
			};
		},
		mounted() {
			
			
		},
		methods: {
			openUrl(url){
				uni.navigateTo({
					url:url
				});
			},
			bindLogin(e) {
				this.login(e.detail.code)
			},
			login(code){
				let that=this
				let wxCode = uni.getStorageSync('wxCode')
				var para = {
					code:code,
				}
				console.log(para)
				
			},
			logout() {
				
			},
			noOpen() {
				uni.showToast({
					icon: 'none',
					title: '敬请期待'
				});
			},
			deleteIDcardFile(event) {
			this[`IDcardFile${event.name}`].splice(event.index, 1);
			},
			// 新增图片
			async IDcardFileRead(event) {
			console.log(event)
			// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
			let lists = [].concat(event.file);
			let fileListLen = this[`IDcardFile${event.name}`].length;
			lists.map((item) => {
				this[`IDcardFile${event.name}`].push({
				...item,
				status: "uploading",
				message: "上传中",
				});
			});
			for (let i = 0; i < lists.length; i++) {
				const result = await this.uploadFilePromise(lists[i].url);
				let item = this[`IDcardFile${event.name}`][fileListLen];
				this[`IDcardFile${event.name}`].splice(
				fileListLen,
				1,
				Object.assign(item, {
					status: "success",
					message: "",
					url: result,
				})
				);
				fileListLen++;
			}
        },
        uploadFilePromise(url) {
          return new Promise((resolve, reject) => {
            let a = uni.uploadFile({
              url: "http://192.168.2.21:7001/upload", // 仅为示例，非真实的接口地址
              filePath: url,
              name: "file",
              formData: {
                user: "test",
              },
              success: (res) => {
                setTimeout(() => {
                  resolve(res.data.data);
                }, 1000);
              },
            });
          });
        },
		}
	};
</script>

<style lang="scss">
.login_btn {
	width: 80%;
	height: 40px;
	background: linear-gradient(-40deg,#f09a3c 0%,#f09a3c 100%);
	box-shadow: 0px 3px 8px #f09a3c;
	border-radius: 25px;
	text-align: center;
	line-height: 40px;
	color: #FFFFFF;
	font-size: 16px;
	letter-spacing: 2px;
	margin: 30px auto;

}
.userinfo{
	text-align: center;
	.fansList{
		display: flex;
		margin: 20px 0;
		.fansList-li{
			flex: 1;
			p{
				margin-top: 5px;
			}
		}
	}
	.pic{
		font-size: 30px;
		font-weight: bold;
		width: 120px;
		height: 120px;
		line-height: 120px;
		text-align: center;
		background: #290502;
		border-radius: 50%;
		color: #fff;
		margin: 20px auto 10px auto;
	}
	.name{
		margin-bottom: 10px;
	}
	.signature{
		color: #999;
		font-size: 14px;
	}
}
.page {
  height: 100%;
  padding: 15px;
  background: #fbfbfb;
}
.user{
	min-height: 80vh;
	background: #fff;
    box-shadow: 1px 1px 5px #999;
	padding-bottom: 40px;
	border-radius: 10px;
	overflow: hidden;
}

.group /deep/.u-cell__body{
	padding: 15px;
}
.group /deep/.u-icon__icon{
	padding-right: 10px;
}

</style>
